<!-- 确认核销-核销券类型 -->
<template>
	<view class="pages">
		<view class="pages-tips fs-sm pl-30 pr-30">
			温馨提示：核销前请仔细与顾客确认使用张数。
		</view>
		<view class="pages-title pl-30 pr-30 flex align-items-center">
			核销记录
		</view>
		<!-- 核销门店信息 -->
		<view class="store-info bgc-w mb-20">
			<!-- 核销门店 -->
			<view class="store-info-title row-box pl-30 pr-30 fs-lg">
				<view class="">
					核销门店
				</view>
				<view class="fc-0 out-1 fw-6">
					莱山万科御龙山店
				</view>
			</view>
			<view class="coupon-info p-30">
				<view class="row-box">
					<image class="coupon-img mr-20" src="/static/images/common/goods-img.png" mode="scaleToFill">
					</image>
					<view class="row-box flex-1">
						<view class="info-box">
							<view class="fs-lg fc-0 fw-6">
								90代100元代金券
							</view>
							<view class="fs-sm">
								周一至周日可用
							</view>
							<view class="discount-bgimg mt-10">
								8.8折
							</view>
						</view>
						<view class="price-box">
							<view class="fc-ac">
								￥90.00
							</view>
							<view class="old-price">
								￥100.00
							</view>
							<view class="fc-0 fs-sm">
								×1
							</view>
						</view>
					</view>
				</view>
				<view class="row-box mt-10">
					<view class="">
						<view class="fc-ac">
							消费张数
						</view>
						<view class="">
							共 <text class="fc-warn">5</text> 张可用
						</view>
					</view>

					<u-number-box integer button-size="28" color="#fff" bgColor="#00A191" iconStyle="color: #fff"
						v-model="useNum" @change="changeUseNum" :max="100"></u-number-box>
				</view>
			</view>
		</view>
		<!-- 客户信息 -->
		<p-customer-info></p-customer-info>
		<!-- 技术支持 -->
		<p-support class=""></p-support>
		<view class="btn-ac">
			确认核销
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				openGoods: false,
				useNum: 0,
			};
		},
		methods: {
			changeUseNum(e) {
				console.log('当前值为: ' + e.value)
			}
		},
		computed: {}
	}
</script>

<style lang="scss" scoped>
	.pages-tips {
		line-height: 60rpx;
		color: #D49B07;
		background-color: #FFF6E9;
	}

	.pages-title {
		height: 96rpx;
	}

	.store-info {
		.store-info-title {
			height: 100rpx;
			border-bottom: 1rpx solid #ededed;
		}

		.coupon-info {
			.coupon-img {
				width: 130rpx;
				height: 130rpx;
				border-radius: 10rpx;
				overflow: hidden;
				flex-direction: 0;
			}

			.price-box {
				display: flex;
				flex-direction: column;
				align-items: flex-end;
				justify-content: center;
			}
		}
	}

	.btn-ac {
		width: 690rpx;
		margin: 60rpx auto;
	}

	.discount-bgimg {
		width: 144rpx;
		height: 36rpx;
		background: url('../../static/images/common/discount.png') no-repeat center center;
		background-size: 100% 100%;
		color: red;
		font-size: 24rpx;
		line-height: 36rpx;
		text-align: right;
		padding-right: 6rpx;
	}
</style>